<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<title>骨医快线</title>
	<link href="../../css/mui.plus.css" rel="stylesheet" />		
	<style>
		.mui-grid-view.mui-grid-9 {
			background-color: #fff;
		}
		.mui-grid-view.mui-grid-9 .mui-table-view-cell {
			padding: 30px 15px;
		}
		.mui-table-view.mui-grid-view .mui-table-view-cell .mui-media-body {
			font-size: 16px;
			color: #30B497;
		}
		.pat-title {
			padding: 11px 15px;
			color: #30B497;
		}
		.pat-usually .mui-table-view-cell {
			font-size: 15px;
			color: #666;
		}
		.mui-grid-view.mui-grid-9 .mui-table-view-cell {
			padding: 0;
		}
		.mui-grid-view.mui-grid-9 .mui-table-view-cell > a:not(.mui-btn) {
			padding: 0;
		}
		.mui-grid-view.mui-grid-9 .mui-table-view-cell img{
			width: 100%;
		}
		.pat-feedback {
			position: relative;
			padding: 10px 0;
		}
		.pat-feedback img {
			position: absolute;
			top: 20px;bottom: 0;right: 10px;
			width: 10vw;
			height: 14vw;
		}
	</style>
</head>
<body>
	
	<header class="mui-bar mui-bar-nav oe-pri-bar">
	    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
	    <h1 class="mui-title">量表库</h1>
	</header>
	
	<div class="mui-content">
		<div class="pat-classify">
			<div class="pat-title">量表分类</div>
			
			<ul id="list-branch" class="mui-table-view mui-grid-view mui-grid-9">
				<li class="mui-table-view-cell mui-media mui-col-xs-6" data-branch="通用">
				    <a href="#">
				        <img src="../../images/scale/btn-universal.png" alt="" />
				    </a>
				</li>
				<li class="mui-table-view-cell mui-media mui-col-xs-6" data-branch="脊柱">
				    <a href="#">
				        <img src="../../images/scale/btn-spine.png" alt="" />
				    </a>
				</li>
				<li class="mui-table-view-cell mui-media mui-col-xs-6" data-branch="上肢">
				    <a href="#">
				        <img src="../../images/scale/btn-upper-limb.png" alt="" />
				    </a>
				</li>
				<li class="mui-table-view-cell mui-media mui-col-xs-6" data-branch="下肢">
				    <a href="#">
				        <img src="../../images/scale/btn-legs.png" alt="" />
				    </a>
				</li>
			</ul>
			
		</div>
		
		<div class="oe-divide-block"></div>
		
		<div class="pat-usually">
			<div class="pat-title">常用量表</div>
			
			<ul id="list-usually" class="mui-table-view">
		        <li class="mui-table-view-cell">
		            <a>
						加载中...
		            </a>
		        </li>
		    </ul>
		</div>
		
		<div class="oe-divide-block"></div>
		
		<div class="pat-feedback">
			<div class="pat-title">量表反馈</div>
			<p style="text-indent: 15px;">根据您的需求，我们将不断丰富量表功能。</p>
			<img id="to-fb" src="../../images/scale/icon-feedback.png" alt="" />
		</div>
		
	</div>
	
	<script id="tmp-usually" type="text/html">
		{{each data as v i}}
			<li class="mui-table-view-cell" data-id = "{{v.rec_rs_id}}">
	            <a>
					{{v.rs_name}}
					<span class="mui-pull-right">{{v.count}}次</span>
	            </a>
	        </li>
		{{/each}}
	</script>
	
	<script src="../../js/mui.min.js"></script>
	<script src="../../js/app.js"></script>
	<script src="../../js/lib/template.js"></script>
	<script type="text/javascript">
		(function($, a){
			var tmpData,
				html,
				rec_id,
				wv;
				
			$('.mui-content').on('tap', '#to-fb', function(){
				$.openWindow({
					url: 'feedback.html',
					waiting: {
						autoShow: false
					}
				})
			});
			
			$.plusReady(function(){
				wv = plus.webview.currentWebview();
				rec_id = wv.rec_id;
				
				// 分支处理
				$('#list-branch').on('tap', 'li', function(){
					if(!a.storage.getUserId()) return $.toast('请先登录哟');
					
					var rs_category = encodeURI(this.dataset.branch);
					app.net.get('c_rating_scale/show_list_by_category',{rs_category: rs_category}, function(data){
						if(data && data.code === '100'){
							var transData = data;
							$.openWindow({
								url: 'branch.html',
								waiting: {
									autoShow: false
								},
								extras: {
									transData: transData,
									rec_id: rec_id
								}
							});
						}
					});
				});
				 
				$('#list-usually').on('tap', 'li', function(){
					var rs_id = this.dataset.id;
					if(rs_id){
						$.openWindow({
							url: 'detail-rec.html',
							waiting: {
								autoShow: false
							},
							extras: {
								rs_id: rs_id,
								rec_id: rec_id
							}
						});
					}
				});
				
				// 获取常用量表
				var getUsual = function(){
					app.net.get('c_rating_scale_record/show_used', {rec_dr_id: a.storage.getUserId()}, function(data){
						if(data && data.code === '100'){
							tmpData = data;
							html = template('tmp-usually', tmpData);
							document.getElementById("list-usually").innerHTML = html;
						}else {
							document.getElementById("list-usually").innerHTML = '<li class="mui-table-view-cell"><a>暂时还没有数据哦</a></li>';
						}
					})
				}
				getUsual();
				
			});
			
		}(mui, app));
	</script>
</body>
</html>